import { Card, Col, Row } from 'antd'
import { history } from 'umi'
import React from 'react'
import './AppsPortal.less'

const colProps = {
  xl: 4,
  lg: 4,
  md: 4,
  sm: 4,
  xs: 4,
  style: { marginBottom: 24,marginTop:24 }
}

const AppsPortal = ({ loading }) => {

  const goToPage = (url) => {
    history.push(url);
  };

  return (
    <Card
    loading={loading}
    bordered={false}
    title="功能入口"
    className="apps-portal"
    style={{height: '100%'}}
    >
    <Row gutter={24} type="flex" justify='center'>
      <Col {...colProps} onClick={() => goToPage('/attendance/record')} className="apps-portal__item">
        <img className="apps-portal__item-icon" alt='' src={require('@/assets/kaoqin.svg')}/>
        <div className="apps-portal__item-label">考勤</div>
      </Col>
      <Col {...colProps} onClick={() => goToPage('/attendance/rest/vacation')} className="apps-portal__item">
        <img className="apps-portal__item-icon" alt='' src={require('@/assets/qingjia.svg')}/>
        <div className="apps-portal__item-label">请假</div>
      </Col>
      <Col {...colProps} onClick={() => goToPage('/benefits/security')} className="apps-portal__item">
        <img className="apps-portal__item-icon" alt='' src={require('@/assets/shebaogongjijin.svg')}/>
        <div className="apps-portal__item-label">社保公积金</div>
      </Col>
      <Col {...colProps} onClick={() => goToPage('/personnel/resign/application')} className="apps-portal__item">
        <img className="apps-portal__item-icon" alt='' src={require('@/assets/lizhishenqing.svg')}/>
        <div className="apps-portal__item-label">离职申请</div>
      </Col>
      <Col {...colProps} onClick={() => goToPage('/personnel/turnPositive')} className="apps-portal__item">
        <img className="apps-portal__item-icon" alt='' src={require('@/assets/xinyuangongzhuanzheng.svg')}/>
        <div className="apps-portal__item-label">新员工转正</div>
      </Col>
      <Col {...colProps} onClick={() => goToPage('/personnel/manage')} className="apps-portal__item">
        <img className="apps-portal__item-icon" alt='' src={require('@/assets/jinshengzhuanzheng.svg')}/>
        <div className="apps-portal__item-label">管理晋级转正</div>
      </Col>
    </Row>
  </Card>
  )
}

export default AppsPortal
